<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
	<meta charset="utf-8">
	<title>Layui</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" href="../shangstatic/css/amazeui.min.css" />
	<link rel="stylesheet" href="../shangstatic/css/admin.css" />

	<link rel="stylesheet" href="../css/business/layui.css" media="all">
	<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
	<script type="text/javascript" src="../js/business/jquery-1.7.2.min.js"></script>
	<script type="text/javascript" src="../js/business/tc.min.js"></script>
	<script type="text/javascript" src="../js/business/tc.all.js"></script>

	<style type="text/css">
		body {
			margin: 0;
			padding: 0;
			font-size: 12px;
		}

		dt {
			padding: 10px;
		}

		i {
			font-style: normal;
		}

		/* detail */
		#detail {
			position: absolute;
			width: 450px;
			height: 320px;
			border: 1px solid #ccc;
			background: #efefef;
			display: none;
		}

		#detail .tit {
			background: #ddd;
			display: block;
			height: 33px;
			cursor: move;
		}

		#detail .tit i {
			float: right;
			line-height: 33px;
			padding: 0 8px;
			cursor: pointer;
		}

		button {
			width: 85px;
			/*设置按钮宽度*/
			height: 30px;
			/*设置按钮高度*/
			color: white;
			/*字体颜色*/
			background-color: #0000FF;
			/*按钮背景颜色*/
			border-radius: 10px;
			/*让按钮变得圆滑一点*/
			border-width: 0;
			/*消去按钮丑的边框*/
			margin: 0;
			outline: none;
			/*取消轮廓*/
			font-family: KaiTi;
			/*字体设置为楷体*/
			font-size: 17px;
			/*设置字体大小*/
			text-align: center;
			/*字体居中*/
			cursor: pointer;
			/*设置鼠标箭头手势*/
		}

		button:hover {
			/*鼠标移动时的颜色变化*/
			background-color: antiquewhite;
		}

		#ok {
			position: absolute;
			left: 175px;
			top: 240px;
		}

		/*
    分页
    */
		/*设置 a 标签的css样式*/
		.page-normal a {
			border: 1px solid #0000FF;
			padding: 5px 7px;
			color: #0000FF;
			margin-left: 20px;
			/*设置标签 a 之间的间隔*/
			text-decoration: none;
			/*去除页码数字下面的下划线*/
		}

		/*设置鼠标经过时 a 标签的css样式*/
		.page-normal a:hover {
			background-color: #0000FF;
		}

		/*设置整个div的css样式,该样式主要用于设置网页内的省略号 …… 的样式，并且同时设置内容居中显示*/
		.page-normal {
			color: #0000FF;
			text-align: center;
		}

		/*设置当前页面的css样式*/
		.page-normal .page-current {
			color: #ffffff;
			background-color: #0000FF;
		}

		/*设置左单括号 < 的css样式*/
		.page-normal .page-prev {
			color: #0000FF;
		}

		/*进行代码优化，将不同css样式中共有的属性放在一起，有助于提高运行效率*/
		.page-normal a,
		.page-normal a:hover,
		.page-normal .page-prev,
		.page-normal .page-current {
			border: 1px solid #ff2ced;
			padding: 5px 7px;
		}
	</style>

</head>

<body>
<div class="am-cf am-padding am-padding-bottom-0">
	<div class="am-fl am-cf">
		<strong class="am-text-primary am-text-lg">行程管理</strong>
	</div>
</div>
<hr>

<table class="layui-hide" id="test"></table>
<h1 align="center">行程列表</h1>
<br />

<form id="busForm" action="/routeIssued/orderList">
	<div align="center">
		<h2><strong> 行程查找: </strong>
			<input type="text" id="busName" placeholder="请输入要查询的行程"  name="routeslssued"/>
			<button type="submit">查询</button>
		</h2>
	</div>
</form>
<button id="t1" onClick="routs()" class="button"> 发起行程单 </button>
<table lay-filter="demo">
	<thead>
	<tr>
		<th lay-data="{field:'signTitle'}">行程名</th>
		<th lay-data="{field:'signOrigin'}">起初时间</th>
		<th lay-data="{field:'signdestination'}">结束时间</th>
		<th lay-data="{field:'sign'}">操作</th>
	</tr>
	</thead>

	<tbody>
	<tr  th:each="rout :${routeIssued}" height="100px">
		<input id="idz" hidden="hidden" name="idz" th:value="${rout.id}" >
		<input id="days" hidden="hidden" name="days" th:value="${rout.days}" >
		<input id="title" hidden="hidden" th:value="${rout.title}">
		<input class="dates" hidden="hidden" th:value="${#dates.format(rout.closeTimes,'yyyy-MM-dd')}">
		<td th:text="${rout.title}">行程名</td>
		<td th:text="${#dates.format(rout.startTimes,'yyyy-MM-dd')}">开始时间</td>
		<td th:text="${#dates.format(rout.closeTimes,'yyyy-MM-dd')}">结束时间</td>
		<td><button type="text" onClick="idsz(this)" th:data-id="${#dates.format(rout.closeTimes,'yyyy-MM-dd')}">删除</button></td>
	</tr>
	</tbody>
</table>

<div id="detail">
	<div class="tit">
		<i class="close">❎</i>
	</div>
	<div>
		<br />
		<h1 align="center">发起行程</h1><br /><br />
		<h2>起始时间：<input type="date" name="date" id="date"/></h2><br /><br />
		<h2>
			选择行程：
			<select  id="route">
				<option class="title1" th:each="routeJb:${routeJbList}" th:value="${routeJb.id}" th:data-id="${routeJb.id}" th:text="${routeJb.title}" th:day="${routeJb.days}"></option>
			</select>
		</h2>
		<br/><br/>
		<button id="ok" class="close" onClick="outfabu()"> 确定发布 </button>
	</div>
</div>
<!-- 分页 -->
<div class="page-normal">
	<a class="page-prev" th:if="${page.getCurrentPageNo() gt 1}"
	   th:href="'/routeIssued/orderList?pageIndex=' + ${page.getCurrentPageNo()- 1}+'&routeslssued='+${routeslssued}">&lt;</a>
	&lt;!&ndash; 数字1 代表当前页面&ndash;&gt;
	<a class="page-current" href="/routeIssued/orderList?pageIndex=1">首页</a>
	<a href="/routeIssued/orderList?pageIndex=2">2</a>
	<a href="/routeIssued/orderList?pageIndex=3">3</a>
	<a th:href="'/routeIssued/orderList?pageIndex=' + ${page.getTotalPageCount()}">最后一页</a>
	<a th:if="${page.getCurrentPageNo() lt page.getTotalPageCount()}"
	   th:href="'/routeIssued/orderList?pageIndex='+ ${page.getCurrentPageNo() + 1}">&gt;</a>
</div>

<script charset="utf-8" src="../js/business/layui.js"></script>
<script type="text/javascript" src="../js/business/layui.all.js"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script type="text/javascript">
	/*
    * 弹窗
    * */
	function routs() {

		var now = new Date();
		var year = now.getFullYear(); //得到年份
		var month = now.getMonth()+1;//得到月份
		var date = now.getDate();//得到日期
		var jbdx = year+"-"+month+"-"+date;

		var dat = $("#dates").val();
	//	alert("dat"+dat);
		popWin("detail");
	}

	function outfabu() {
		/*var jbid = $("#idz").val();
		var data = $("#date").val();
		var days = $("#days").val();*/
	//	alert(jbid+"\n"+data+"\n"+days);
		//var dateConvert = new Date(Date.parse(data));
	//	alert(dateConvert);
		//alert(jbid+data+days);
		var options=$("#route option:selected");
		var day = options.attr("day");
		//alert(day);
		var jbid =  options.attr("data-id");
		var data = $("#date").val();
		var dateConvert = new Date(Date.parse(data));
		//alert(jbid+"\n"+dateConvert+"\n"+day);
		$.ajax({
			type: "GET",
			url: "/routeIssued/addRoutlssued",
			data: {jbid: jbid, date: dateConvert,days:day},
			error: function () {
				alert("发布失败！！！！！！！");
			},success:function (data) {
				//alert(data);
				if(data=="-1"){
					alert("发布失败可能存在相同的行程和日期");
				}else{
					alert("发布成功");
				}
			}
		});
	}

	var ida = $("#idz").val();
	function idsz(obj) {

		var dat = $(obj).attr("data-id");//结束时间
		//new Date(dat).getTime();//将字符串时间转换成时间戳
		var now = new Date();
		var year = now.getFullYear(); //得到年份
		var month = now.getMonth()+1;//得到月份
		var date = now.getDate();//得到日期
		var jbdx = year+"-"+month+"-"+date;
		//new Date(date).getTime();//将字符串时间转换成时间戳

		var fu =  $(obj).parent().parent().parent();

		//alert("结束时间:" + new Date(dat).getTime() + "\n当前时间:" + new Date(jbdx).getTime());
		if (confirm('确定要永久删除选择项吗？')) {
			if (new Date(dat).getTime() < new Date(jbdx).getTime()) {
				$.ajax({
					type: "GET",
					url: "/routeIssued/deleteRoutlssuedAndJb?idz=" + ida,
					error: function () {
						alert("删除失败！！！！！！！");
					},
					success: function (data) {//回调函数
						if (data=="1"){
							fu.remove();
							alert("删除成功");
						} else {
							alert("删除失败！！！！！！！");
						}
					}
				});
			} else {
				alert("行程未结束，不能删除!!!");
			}
		}
	};


	var table = layui.table;
	//转换静态表格
	table.init('demo', {
		height: 350 //设置高度
		,
		limit: 10 //注意：请务必确保 limit 参数（默认：10）是与你服务端限定的数据条数一致
		//支持所有基础参数
	});

</script>
</body>

</html>